
body{
    background: -webkit-linear-gradient(top, #f84b38 0%,#feba18 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #f84b38 0%,#feba18 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    padding-bottom: 1.1rem;
}


.banner{
    width: 100%;
    height: 8.92rem;
    background-image: url(../img/banner.png);
    background-size: cover;
    background-position: center bottom;
    background-repeat: no-repeat;
    margin-bottom: .2rem;
}
.banner>img{
    width: 4rem;
    position: absolute;
    left: 1.75rem;
    top: 7.74rem;
}
.f1{
    margin-bottom: .28rem;
    width: 100%;
    font-size: 0;
    padding: 0 .4rem;
}
.list{
    width: 100%;
}

.list>li{
    width: 100%;
}

.list img{
    width: 3.1rem;
}
.f2{
    width: 100%;
    font-size: 0;
    padding: 0 .4rem;
    text-align: center;
    margin-bottom: .36rem;
}
.zi1>img{
    width: 5.58rem;
    margin-bottom: .36rem;
}
.f2-1{
    background-color: white;
    width: 100%;
    height: 13.46rem;
    margin: 0 auto;
    border-radius: 16px;

}
.f2-1>img{
    width: 5.2rem;

}
.f3{
    width: 100%;
    font-size: 0;
    padding: 0 .4rem;
    margin-bottom: .36rem;
}
.zi2{
    text-align: center;
}
.zi2>img{
    width: 5.58rem;
    margin-bottom: .36rem;
}
.f3-1{
    background-color: white;
    width: 100%;
    margin: 0 auto;
    border-radius: 16px;
    height: 6.12rem;
    padding: .3rem 0;

}
.list2{
    width: 100%;
}
.list2>li{
    text-align: center;
    width: 50%;
    float:left;
    margin-bottom:.3rem;
}
.list2>li:nth-child(3){
    margin-bottom:0;
}
.list2>li:last-child{
    margin-bottom:0;
}
.list2 img{
    width: 1.5rem;
    height: 1.5rem;
}
.p1{
    font-size: .3rem;
    color: #f84b38;
    margin-top: .2rem;
}
.p2{
    font-size: .3rem;
    color:#333333;
    margin-top: .1rem;
}
.f4{
    width: 100%;
    font-size: 0;
    padding: 0 .4rem;
    position: relative;
}

.zi3>img{
    width:100%;
}
.f4{
    font-size: 0 ;
    padding: 0 .4rem;
}
.shouji{
    width: 100%;
    height: 1rem;
    border-radius: 1rem;
    background-color: #ff4733;
    margin-bottom: .28rem;
    box-shadow: inset 0 10px 20px rgba(198,32,14,0.5);
}
.s1{
    font-size: .3rem;
    color: white;
}
.s2{
    color: #fff714;
    margin-left: .24rem;
}
.f4>p{
    font-size: .4rem;
    color: white;
    text-align: center;
    margin-bottom: .28rem;
}
.list3{
    font-size: 0;
    width: 100%;
    position: relative;
    height: 1.22rem;
}
.list3>li{
    width: .68rem;
    height: .68rem;
    border-radius: 50%;
    border: 1px solid white;
    display: inline-block;
}
.list3>li:first-child{
    background: url("../img/tou1.jpg");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    z-index:10;
    position: absolute;
    left:.46rem;
}
.list3>li:nth-child(2){
    background: url("../img/tou2.jpg");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    z-index:20;
    position: absolute;
    left:.93rem;
}
.list3>li:nth-child(3){
    background: url("../img/tou3.jpg");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    z-index:30;
    position: absolute;
    left:1.42rem;
}
.list3>li:nth-child(4){
    background: url("../img/tou4.jpg");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    z-index:40;
    position: absolute;
    left:1.9rem;
}
.list3>li:nth-child(5){
    background: url("../img/tou5.jpg");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    z-index:50;
    position: absolute;
    left:2.37rem;
}
.list3>li:nth-child(6){
    background: url("../img/tou6.jpg");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    z-index:60;
    position: absolute;
    left:2.86rem;
}
.list3>li:nth-child(7){
    background: url("../img/tou7.jpg");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    z-index:70;
    position: absolute;
    left:3.33rem;
}
.list3>li:nth-child(8){
    background: url("../img/tou8.jpg");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    z-index:80;
    position: absolute;
    left:3.82rem;
}
.list3>li:nth-child(9){
    background: url("../img/tou9.jpg");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    z-index:90;
    position: absolute;
    left:4.29rem;
}
.list3>li:last-child{
    background: url("../img/tou10.jpg");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    z-index:100;
    position: absolute;
    left:4.77rem;
}

.list5{
    width: .62rem;
    position: absolute;
    right: .82rem;
    bottom: .84rem;

}
.list5>li{
     width: .1rem;
     height: .1rem;
     background-color: white;
     border-radius: 50%;
     display: inline-block;
     margin-right:.16rem;
 }
.list5>li:last-child{
    margin-right:0;
}
footer{
    width: 100%;
    height:1.1rem;
    position: fixed;
    bottom: 0;
    background-color:#f7503e;
    font-size: 0;
    z-index: 200;
}
.list4{
    width: 100%;
}
.list4>li{
    display: inline-block;
}
.list4>li:first-child>img{
    width: .98rem;
    margin-right: .26rem;
}
.list4>li:nth-child(2){
   position: relative;
}
.list4>li:last-child>img{
    width: 1.6rem;
}
.list4 i{
    position: absolute;
    left: .2rem;
    top: .2rem;
    font-size:.35rem;
    color: #646464;
}
.tel{
    width: 4rem;
    height: .7rem;
    background-color: white;
    border-radius: 8px;
    margin-right: .28rem;
    font-size: .3rem;
    color: #8f8f8f;
    padding-left: .66rem;
}
.tel::-webkit-input-placeholder{
    color: #8f8f8f;
}